/**
* 商品活动
*/

<template name="basics">
	<view>
		<scroll-view scroll-y class="page">
			<view class="cu-bar bg-white rotationBox">
				<Rotation></Rotation>
			</view>
			<CountDown class="cuntDown" ref="child" v-if="!over"> </CountDown>

			<view class="goodBox">
				<view class="goodName">
					{{good.name}}
				</view>
				<view class="priceBox ">
					<view class="priceFu ">
						￥
					</view>
					<view class="priceShuzi ">
						{{good.price}}
					</view>

					<view class="verticalLine">

					</view>
					<view class="kucun">
						{{good.stockMsg}} {{good.stock}}
					</view>
				</view>

				<view class="priceMsg">
					<view class='cu-tag radius bg-red'>返</view>
					<view class="priceBox1">
						￥ {{good.returnPrice}} / 件
					</view>
					{{good.shareMsg}} ￥ {{good.returnPrice}} / 件

				</view>
				<view class="butBox">
					<button class="cu-btn round bg-red" @click="share()" open-type="share" v-if="!over">{{good.shareBut}} ￥
						{{good.returnPrice}} / 件</button>
					<button class="cu-btn round bg-orange" @click="buy()">{{good.buyButton}}</button>
				</view>

			</view>

			<Introduce class="item"></Introduce>

			<Rule class="item"></Rule>

			<RankList class="item"></RankList>


			<view class="guanzhu">
				<button class="cu-btn round guanzhuBut">关注我们</button>

			</view>
			<view class="foot">

			</view>
			<popup ref="popup" type="bottom">底部弹出 Popup</popup>

		</scroll-view>
	</view>
</template>

<script>
	import Rotation from '../../components/Rotation/Rotation.vue'
	import CountDown from '../../components/countDown/countDown.vue'
	import Introduce from '../view/introduce.vue'
	import Rule from '../view/rules.vue'
	import RankList from '../view/rankList.vue'

	export default {
		name: "basics",
		components: {
			Rotation,
			CountDown,
			Introduce,
			Rule,
			RankList,
		},
		data() {
			return {
				good: this.CON.CON.goods,
				over: false,
			};
		},
		onReady() {
			this.over = this.$refs.child.over;
		},
		onShow() {
			console.log("success")
		},
		methods: {
		
			shareToWeixin: function(scene) {
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: (res) => {
						uni.share({
							provider: 'weixin',
							type: 2,
							title: 'app微信分享测试',
							scene: scene,
							imageUrl: res.tempFilePaths[0],
							success: (res) => {
								// console.log(res)
								uni.showToast({
									title: '分享成功！'
								})
							},
							fail: (err) => {
								// console.log(err)
							}
						})
					}
				})

			},
			buy() { //马上抢购

				console.log("调用支付");
				this.Reques.payment('http://192.168.3.227/tools/shangchengzhifu/static/data.json', 'get', {}).then(res => {
					let result=res.data;
					console.log(result);
					uni.getProvider({
						service: 'payment',
						success(res) {
							uni.requestPayment({
								provider: res.provider[0],
				               	appId:result.appId,
								orderInfo: '2333', //订单数据，
								timeStamp: result.timeStamp, //当前的 时间错
								nonceStr: result.nonceStr,
								package: result.package,
								signType: 'MD5', //签名算法
								paySign: result.paySign, //签名
								success: (res) => {
									uni.showToast({
										title:'微信支付成功',
										icon: 'success',
										duration: 1500
									});
								},
								fail: (err) => {
									uni.showToast({
										title: "支付取消",
										duration: 1500,
										icon: 'none'
									})
								}

							})

						}
					})



				}, (err) => {



				})



			}


		}
	}
</script>

<style scoped>
	.page {
		height: 100vh;
	}

	.cuntDown {
		height: 6vh;
	}

	.goodBox {
		height: 42vh;
		background-color: white;
		display: flex;
		flex-direction: column;
		padding: 4vw 4vw 4vw 4vw;
	}

	.rotationBox {
		/* 	height: 38vh; */
	}

	.goodName {
		height: 5vh;
		font-size: 1.5em;

	}

	.priceBox {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.priceBox>view {
		line-height: 5vh;
		margin-left: 2vw;
	}

	.priceFu {
		display: flex;

		align-items: flex-end;

	}

	.priceShuzi {

		font-size: 1.8em;
		font-weight: 900;
		color: red;
	}

	.priceMsg {
		display: flex;
		align-items: center;
		height: 5vh;
	}

	.verticalLine {
		width: 0.7vw;
		height: 3vh;
		background-color: #DCDCDC;
	}

	.priceBox1 {
		background-color: #FFE4E4;
		color: red;
		border-radius: 2px;
		padding-right: 1vw;

	}

	.butBox {

		display: flex;
		flex-direction: column;
	}

	.butBox>button {
		margin-top: 3vh;
		height: 6vh;


	}

	.item {
		margin-top: 2vh;
	}

	.guanzhu {
		margin-top: 4vh;
		height: 15vh;
		display: flex;
		align-items: center;
		flex-direction: column;
	}

	.guanzhu>button {
		width: 50vw;
		height: 6vh;
	}

	.guanzhuBut {
		color: white;
		background-image: linear-gradient(to bottom, #F3BF79, #DCA357);
	}
</style>
